<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui"
      xmlns:sec="http://www.springframework.org/security/tags">
   
<h:head>
    <title>Welcome</title>
</h:head>

<h:body>

    <!-- View element level Spring Security : only can view for who has the role 'ROLE_ADMIN' -->
    <sec:authorize access="hasAnyRole('ROLE_ADMIN')">
    <h:form id="form2">
        <table>
            <tr>
                <td><h:outputLabel for="id" value="Id : "/></td>
                <td><p:inputText id="id" value="#{customerMB.id}">
                    <f:converter converterId="javax.faces.Integer"/>
                    <p:ajax event="blur" update="idMsg"/>
                </p:inputText>
                    <p:message id="idMsg" for="id" display="icon"/>
                </td>
            </tr>
            <tr>
                <td><h:outputLabel for="name" value="Name : "/></td>
                <td><p:inputText id="name" value="#{customerMB.name}">
                    <f:validateLength minimum="1"/>
                    <p:ajax event="blur" update="nameMsg"/>
                </p:inputText>
                    <p:message id="nameMsg" for="name" display="icon"/>
                </td>
            </tr>
            <tr>
                <td><h:outputLabel for="surname" value="Surname : "/></td>
                <td><p:inputText id="surname" value="#{customerMB.surname}">
                    <f:validateLength minimum="1"/>
                    <p:ajax event="blur" update="surnameMsg"/>
                </p:inputText>
                    <p:message id="surnameMsg" for="surname" display="icon"/>
                </td>
            </tr>
            <tr>
                <td><p:commandButton id="addUser" value="Add" action="#{customerMB.addCustomer}" ajax="false"/></td>
                <td><p:commandButton id="reset" value="Reset" action="#{customerMB.reset}" ajax="false"/></td>
            </tr>
        </table>
    </h:form>
    </sec:authorize>
  
    <br/>
 
    <h:form id="form1">
        <p:growl id="messages" showDetail="true"/>
        <p:dataTable id="customers" var="customer" value="#{customerMB.customerList}" style="width: 10%" editable="true">  
            <p:ajax event="rowEdit" listener="#{customerMB.onEdit}" update=":form1:messages"/>
            <p:ajax event="rowEditCancel" listener="#{customerMB.onCancel}" update=":form1:messages"/>             
            <p:column headerText="ID">
                <h:outputText value="#{customer.id}"/>
            </p:column>
            <p:column headerText="Name">
                <f:facet name="header">
                    <h:outputText value="Name"/>
                </f:facet>
                <p:cellEditor>
                      <f:facet name="output">
                        <h:outputText value="#{customer.name}"/>
                    </f:facet>
                    <f:facet name="input">
                           <p:inputText value="#{customer.name}" label="name"/>
                    </f:facet>             
                </p:cellEditor>
            </p:column>
            <p:column headerText="Surname">
                <p:cellEditor>
                      <f:facet name="output">
                        <h:outputText value="#{customer.surname}"/>
                    </f:facet>
                    <f:facet name="input">
                           <p:inputText value="#{customer.surname}" label="surname"/>
                    </f:facet>             
                </p:cellEditor>             
            </p:column>
            <sec:authorize access="hasAnyRole('ROLE_ADMIN')">         
            <p:column>
                <f:facet name="header">Delete</f:facet>
                <h:commandLink value="Delete" action="#{customerMB.deleteCustomer(customer)}"/>
            </p:column>
            <p:column style="width:20%">
                <f:facet name="header">Update</f:facet>
                <p:rowEditor/>
            </p:column>           
               </sec:authorize>           
        </p:dataTable>
        <br/>
        <p:commandButton value="Logout" id="logout" action="#{loginMgmtBean.logout}"/>           
    </h:form>
    
	<h:form id="form3">
    	<p:panel header="Order List">
         	<h3 style="margin-top: 0">Basic OrderList</h3>
		    <p:orderList value="#{orderListView.customers}"
					     var="customer" controlsLocation="none" 
					     itemLabel="#{customer}"
					     width="600" 
					     style="min-width:600px; width:600px !important;"
					     itemValue="#{customer}" />
		    <p:commandButton value="Submit" 
		    				 update="displayCustomers" 
		    				 oncomplete="PF('customerDialog').show()" 
		    				 style="margin-top:5px" />
		    				 
	    <p:dialog modal="true" showEffect="fade" hideEffect="fade" widgetVar="customerDialog" header="Persons" width="600">
	        <p:dataList id="displayCustomers" value="#{orderListView.customers}" var="customer">
	            <h:outputText value="#{customer}" />
	        </p:dataList>
	    </p:dialog>		    				 
   		</p:panel>
    </h:form>
</h:body>

</html>